<template id="tmp-legend">
    <div>
        分配策略 <span class="required-star" style="font-size:20px">{{policyName}}</span> <span class="required-star">({{remark}})</span>
        的权限
    </div>
</template>

<template id="tmp-permissions">
    <form class="layui-form" lay-filter="tb-permissions-form" action="javascript:;">
        <input type="hidden" name="id" value="" />
        <div class="layui-form-item">
            <label class="layui-form-label"></label>
            <div class="layui-input-block">
                <input type="radio" name="setType" lay-filter="setType" value="FAST" title="快速设置" checked>
                <input type="radio" name="setType" lay-filter="setType" value="MASTER" title="高级">
            </div>
        </div>
        <div class="layui-form-item form-rr-fast">
            <label class="layui-form-label">权限设置</label>
            <div class="layui-input-block">
                <span style="color:red"><input type="radio" lay-filter="optionType" name="optionType" value="DENY"
                        title="禁止访问" /></span>
                <span style="color:blue"> <input type="radio" lay-filter="optionType" name="optionType" value="READ_ONLY"
                        title="只读" checked /></span>
                <span style="color:green"> <input type="radio" lay-filter="optionType" name="optionType" value="ALL"
                        title="读写" /></span>
            </div>
        </div>
        <div class="layui-form-item form-rr-all display-none">
            <label class="layui-form-label">权限设置</label>
            <div class="layui-input-block">
                <input type="checkbox" name="allowGet" value=true title="查询" lay-skin="primary">
                <input type="checkbox" name="allowPost" value=true title="新增" lay-skin="primary">
                <input type="checkbox" name="allowPut" title="修改" value=true lay-skin="primary">
                <input type="checkbox" name="allowDelete" title="删除" value=true lay-skin="primary">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="button" class="layui-btn layui-btn-sm lay-submit layui-btn-normal" lay-submit lay-filter="resource">立即提交</button>
                <button type="button" onclick="layer.closeAll()" class="layui-btn layui-btn-sm layui-btn-primary">关闭</button>
            </div>
        </div>
    </form>
</template>


<div class="wmm-module">
    <div class="layui-form-item">
        <button class="layui-btn layui-btn-sm layui-btn-normal" onclick="fb.router.route({ url: '/fastboot/pages/sys/policy', pushState: fb.router.state.searchForm})">返回到策略管理</button>
    </div>

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend></legend>
    </fieldset>
    <div>
        <div id="tb-permissions"></div>
    </div>
</div>

<script>

    new Wmm({

        //页面变量
        vars: {
            table: {},
            policy: {},
        },
        methods: {
            getPermissionById(permissions, id) {
                for (var index = 0; index < permissions.length; index++) {
                    var permission = permissions[index];
                    if (permission.id === id) {
                        return permission;
                    }
                }
            },

            isReadOnly(permission) {
                return permission.allowGet && !permission.allowPost && !permission.allowPut && !permission.allowDelete;
            },
            hasAllPermission(permission) {
                return permission.allowGet && permission.allowPost && permission.allowPut && permission.allowDelete;
            },
            isDenyAll(permission) {
                return !permission.allowGet && !permission.allowPost && !permission.allowPut && !permission.allowDelete;
            },
            getFastPermissionState(permission) {
                var isReadOnly = this.isReadOnly(permission);
                var hasAllPermission = this.hasAllPermission(permission);
                var isDenyAll = this.isDenyAll(permission);
                if (isReadOnly) {
                    return "READ_ONLY";
                }
                if (hasAllPermission) {
                    return "ALL";
                }
                if (isDenyAll) {
                    return "DENY";
                }
            }
        },


        imports: ["datatable", "form", "api", "sysTools"],

        //页面事件注册
        listener: function () {
            fb.form.on('submit', function (data) {
                if ("FAST" === data.field.setType) {
                    if ("ALL" === data.field.optionType) {
                        data.field.allowGet = true;
                        data.field.allowDelete = true;
                        data.field.allowPost = true;
                        data.field.allowPut = true;
                    } else if ("READ_ONLY" === data.field.optionType) {
                        data.field.allowGet = true;
                        delete data.field.allowDelete;
                        delete data.field.allowPost;
                        delete data.field.allowPut;
                    } else {
                        delete data.field.allowGet;
                        delete data.field.allowDelete;
                        delete data.field.allowPost;
                        delete data.field.allowPut;
                    }
                } else {
                    delete data.field.optionType;
                }


                var update = {};
                update.id = vars.policy.id;
                update.permissions = data.field;
                fb.api.policy.updatePermissions(update, function (ret) {
                    //TODO 合并
                    layer.closeAll();
                    layer.msg("权限集更新成功")
                    vars.policy.permissions = ret;
                    renders.flush();

                })

            });


            //高级开关
            fb.form.on("radio(setType)", function (data) {
                if ("FAST" === data.value) {
                    document.querySelector(".form-rr-all").classList.add("display-none");
                    document.querySelector(".form-rr-fast").classList.remove("display-none");
                    return;
                }
                document.querySelector(".form-rr-fast").classList.add("display-none");
                document.querySelector(".form-rr-all").classList.remove("display-none");
            });
        },

        //渲染对象
        renders: {
            flush: function () {
                vars.table.flush();
            },

            renderTable: function () {
                vars.table = new DataTable({
                    el: "tb-permissions",
                    url: fb.api.resource.url + "?appsId=" + vars.policy.appsId,
                    defines: [
                        {
                            head: "资源编码",
                            prop: "resource_code",
                        }, {
                            head: "资源名称",
                            prop: "resource_name",
                        }, {
                            head: "资源路径",
                            prop: "url",
                            visible: function () {
                                if (sysTools.isDeveloper()) {
                                    return true;
                                }
                                return false;
                            }
                        }, {
                            head: "当前权限",
                            type: "dom",
                            replace: function (v, o) {
                                var permission = methods.getPermissionById(vars.policy.permissions, o.id);
                                if (!permission) {
                                    return '<a class="layui-btn layui-btn-primary layui-btn-xs" >未分配</a>'
                                }
                                if (methods.isDenyAll(permission)) {
                                    return '<a class="layui-btn layui-btn-danger layui-btn-xs" >禁止访问</a>'
                                }
                                if (methods.isReadOnly(permission)) {
                                    return '<a class="layui-btn layui-btn-normal layui-btn-xs" >只读</a>'
                                }
                                if (methods.hasAllPermission(permission)) {
                                    return '<a class="layui-btn x layui-btn-xs">读写</a>'
                                }
                                var permissionDescription = "";
                                if (permission.allowGet) {
                                    permissionDescription += "查询,";
                                }
                                if (permission.allowPost) {
                                    permissionDescription += "添加,";
                                }
                                if (permission.allowPut) {
                                    permissionDescription += "修改,";
                                }
                                if (permission.allowDelete) {
                                    permissionDescription += "删除,";
                                }
                                return permissionDescription.substring(0, permissionDescription.length - 1);
                            }
                        }
                    ],
                    handles: [
                        {
                            edit: function (data) {
                                renders.box(data);
                            }
                        }

                    ],
                });
            },
            render: function () {
                vars.policy = fb.router.state.policy;
                document.querySelector("legend").innerHTML = document.querySelector("#tmp-legend").innerHTML.render(vars.policy);
                renders.renderTable();
            },
            //添加修改角色层
            box: function (data) {
                layer.open({
                    type: 1,
                    title: "分配权限",
                    content: document.querySelector("#tmp-permissions").innerHTML,
                    area: ['500px', '220px'],
                    success: function () {
                        var initData = {};
                        initData.id = data.id;
                        //当前编辑的策略的权限
                        var permission = methods.getPermissionById(vars.policy.permissions, data.id);

                        if (!permission) {
                            fb.form.val('tb-permissions-form', initData);
                            fb.form.render();
                            return;
                        }
                        var fastState = methods.getFastPermissionState(permission);
                        initData.setType = (fastState) ? "FAST" : "MASTER";

                        if (fastState) {
                            document.querySelector(".form-rr-fast").classList.remove("display-none");
                            document.querySelector(".form-rr-all").classList.add("display-none");
                        } else {
                            document.querySelector(".form-rr-fast").classList.add("display-none");
                            document.querySelector(".form-rr-all").classList.remove("display-none");
                        }

                        initData.optionType = fastState;

                        if (permission.allowGet) {
                            initData.allowGet = true;
                        }
                        if (permission.allowPost) {
                            initData.allowPost = true;
                        }
                        if (permission.allowPut) {
                            initData.allowPut = true;
                        }
                        if (permission.allowDelete) {
                            initData.allowDelete = true;
                        }


                        fb.form.val('tb-permissions-form', initData);
                        fb.form.render();

                    }
                });
            }
        },

    });

</script>